<template>
	<view class="index">
		<!--搜索导航栏-->
		<!--		<rf-search-bar @link="toCategory" @search="toSearch" :title="'链上牡丹'" :icon="'iconfenlei1'" :headerShow="headerShow"-->
		<!--		 :placeholder="hotSearchDefault" />-->
		<view class="rf-search-bar">
			<!-- 状态栏 -->
			<view class="status"></view>
			<view class="header">
				<!-- 跳转分类模块 -->
				<view class="addr">
					<image src="../../static/mdl-img/tab-logo.png" style="width: 52upx;margin: 0 20upx 0 30upx" mode="widthFix"></image>
					链上牡丹
				</view>
				<!-- 搜索框 -->
				<view class="input-box">
					<view class="iconfont iconsousuo"></view>
					<input @tap="toSearch" disabled value="搜索" placeholder-style="color:#ccc;" style="margin-top: -4rpx;" />
					<view class="icon search" @tap.stop="toSearch"></view>
				</view>
			</view>
			<!-- 占位 -->
			<view v-if="headerShow" class="place"></view>
		</view>
		<!-- 轮播图1 -->
		<view class="swiper">
			<!--		<view class="bg-box"></view>-->
			<view class="indexswiper-box" style="margin-top: 30rpx;">
				<rf-swipe-dot :info="carouselList.index_top" mode="nav" :current="current" field="title">
					<swiper @change="handleDotChange" autoplay="true">
						<swiper-item v-for="(item, index) in carouselList.index_top" @tap="indexTopToDetailPage(item.jump_type, item.jump_link)"
						 :key="index">
							<view class="indexswiper-item">
								<image :src="item.cover" mode="aspectFill" />
							</view>
						</swiper-item>
					</swiper>
				</rf-swipe-dot>
			</view>
		</view>
		<view class="mdl-box" v-if="preferential_policies.buy_product!=''">
			<view class="todayPrice">
				<view class="todayMarket" :style="jieri!=0?'background: linear-gradient(90deg, #25764D, #175339);':''">今日行情</view>
				<view class="todayPrice-bg" v-if="jieri==0">
					<view class="todayPrice-box" style="border-right: 4rpx solid #e3e3e3;">
						<view style="font-size: 24rpx;line-height: 35rpx">基准价<text style="color:#72BD58">{{mdl_info.standard_price}}</text></view>
					</view>
					<view class="todayPrice-box">
						<view class="todayPrice-name"><text>{{ mdl_info.increase }}</text></view>
						<view style="font-size: 24rpx;line-height: 35rpx">市场价<text style="color:#72BD58">{{ mdl_info.market_price }}</text></view>
					</view>
				</view>
				<view class="todayPrice-bg" v-if="jieri!=0">
					<view class="todayPrice-box" style="border-right: 4rpx solid #e3e3e3;">
						<view style="font-size: 24rpx;line-height: 35rpx">基准价:<text style="color:#18543A">{{mdl_info.standard_price}}</text></view>
					</view>
					<view class="todayPrice-box">
						<view class="todayPrice-name"><text>{{ mdl_info.increase }}</text></view>
						<view style="font-size: 24rpx;line-height: 35rpx">市场价:<text style="color:#18543A">{{ mdl_info.market_price }}</text></view>
					</view>
				</view>
			</view>
		</view>
		<!--#ifdef APP-PLUS-->

		<view class="lookVideo" @click="showAd()" v-if="jieri==0">
			<image src="../../static/my-img/lookVideo.png" style="width: 92%;margin: 10upx 4%" mode="widthFix"></image>
		</view>
		<view class="lookVideo" @click="showAd()" v-else>
			<image src="http://mudanh5.bxwhl.com/active-img/jili.png" style="width: 92%;margin: 10upx 4%" mode="widthFix"></image>
		</view>
		<!--#endif-->
		<!-- 首页广告 -->
		<!-- 测试 adpid="1111111111"-->
		<view class="ad-view" >
			<ad adpid="1013738552" @load="adLoad"></ad>
		</view>
		<!-- 分类列表 -->
		<!-- <view class="category-list" v-if="1">
			<view v-for="(item,index) in productCateList" :key="index">
				<view class="category" @tap.stop="navToList(item.id)">
					<view class="img">
						<image :src="item.cover" mode="aspectFill"></image>
					</view>
					<view class="text">{{ item.title }}</view>
				</view>
			</view>
		</view> -->
		<!--    公告-->
		<rf-swiper-slide :list="announceList">
			<view slot="header" class="swiper-slide-header">
				<image class="swiper-slide-image" src="/static/news.png" mode="widthFix" v-if="jieri==0"></image>
				<image class="swiper-slide-image" src="http://mudanh5.bxwhl.com/active-img/gonggao.png" mode="widthFix" v-else></image>
			</view>
		</rf-swiper-slide>
		<!-- 景岗区 -->
		<view class="iconbox">
			<view @click="navTo('/pages/merchant/merchantList')">
				<image src="../../static/index1.png"></image>
				<view>商业街</view>
			</view>
			<view @click="navTo('/pages/product/vipgoodes?dvip=2')">
				<image src="../../static/index2.png"></image>
				<view>会员专区</view>
			</view>
			<view>
				<image src="../../static/index3.png"></image>
				<view>活动专区</view>
			</view>
			<view @click="navTo('/pages/product/vipgoodes?dvip=1')">
				<image src="../../static/index4.png"></image>
				<view>兑换专区</view>
			</view>
		</view>
		<!-- 牡丹特色馆 -->
		<view class="mudan" @click="totese">
			牡丹特色馆
		</view>





		<!-- 签到弹窗 -->
		<!-- <view class="mdl-box">
			<view class="mdl-title">地方特产馆</view>
		</view>
		<view class="featuredPavilion">
			<view class="featuredPavilion-box" @click="navToList(864)">
				<image src="../../static/mdl-img/shandong1.png" mode="widthFix" class="featuredPavilion-img"></image>
				<text>山东馆</text>
			</view>
			<view class="featuredPavilion-box" @click="navToList(865)" style="margin: 0 5%;">
				<image src="../../static/mdl-img/yunnan1.png" mode="widthFix" class="featuredPavilion-img"></image>
				<text>云南馆</text>
			</view>
			<view class="featuredPavilion-box" @click="$api.msg('敬请期待')">
				<image src="../../static/mdl-img/hunan1.png" mode="widthFix" class="featuredPavilion-img"></image>
				<text>湖南馆</text>
			</view>
		</view>
		<view class="mdl-box" @click="navTo('/pages/merchant/merchantList')">
			<view class="mdl-title"><text>商家店铺</text>
				<view class="lookShop">查看更多商家 <text class="iconfont iconyou "></text></view>
			</view>
		</view>
		<view class="featuredPavilion">
			<view class="featuredPavilion-box" @click="navToList(864)">
				<image src="../../static/mdl-img/shandong1.png" mode="widthFix" class="featuredPavilion-img"></image>
			</view>
		</view> -->
		<!-- 会员卡 -->
		<!-- <view class="vip_box" @click="goVip">
			<view class="vip_name">
				<text style="padding-left: 20rpx;">会员专区</text>
				<text style="margin-left: 30rpx;">享受更多权益</text>
			</view>
			<view>
				<image src="../../static/vip.png" mode="widthFix" style="width: 690rpx;"></image>
			</view>
		</view>
		
		<view class="mdl-box">
			<view class="mdl-title">推荐商品</view>
		</view> -->

		<!-- <rf-floor-index :list="recommendProductList" :header="{title: '', desc: 'Recommend Product'}" @toBanner="indexTopToDetailPage"
		 @toList="toProductList({is_recommend: 1})" @detail="navToDetailPage" :banner="carouselList.index_recommend && carouselList.index_recommend[0]"
		 :bannerShow="false" /> -->
		<!-- 底部产品 -->
		<view class="goodbox">
			<view v-for="(item,index) in recommendProductList" :key="index" class="view" @click="navToDetailPage(item.id)">
				<image :src="item.picture" mode="aspectFill"></image>
				<view class="namebox">
					<view class="name">{{item.name}}</view>
					<view class="pricebox">
						<text class="price">{{item.price}}</text>
						<text class="xiaolaing">{{item.sales}}付款</text>
					</view>
				</view>
			</view>
		</view>

		<!--网站备案号-->
		<!--#ifdef H5-->
		<view class="copyright" v-if="config.web_site_icp">
			{{ config.copyright_desc }} <a href='http://www.beian.miit.gov.cn'>{{ config.web_site_icp }}</a>
		</view>
		<!--#endif-->
		<!--页面加载动画-->
		<rf-loading v-if="loading"></rf-loading>


		<!-- 活动弹窗 -->
		<view class="active-box" v-if="jieri>0 && active">
			<image src="http://mudanh5.bxwhl.com/active-img/tanchuang1.png" mode="widthFix" class="active-img" @click="tohuod"></image>
			<image src="/static/close-signIn-img.png" mode="widthFix" class="active-close" @click="active = false"></image>
		</view>


		<view class="openScreen" v-if="openScreen" @click="openScreen=!openScreen">
			<video src="../../static/mdl-img/kaiping.mp4" id="myVideo" autoplay="autoplay" :controls="false" @ended="videoEnd"
			 class="openScreenVideo"></video>
		</view>
		<!-- 会员卡充值弹窗 -->
		<view v-if="isVip" class="huiyuan">
			<view class="huiyuan_b">
				<view class="card_num">卡号:<input type="text" placeholder="请输入卡号" v-model="vip_cz.card_num" style="padding-left: 8rpx; display: inline-block; width: 448rpx; font-size: 30rpx;" /></view>
				<view class="card_num card_pwd">卡密:<input type="text" placeholder="请输入密码" v-model="vip_cz.card_password" style="padding-left: 8rpx; display: inline-block; width: 448rpx; font-size: 30rpx" /></view>
				<view class="centel" @click="centel">取消</view>
				<view class="centel " :class="{'queding':que}" @click="chongzhi">确定</view>
			</view>
		</view>
		<!-- 会员提示弹框 -->
		<view class="kefubox" v-if="kefuFlag">
			<image src="../../static/kefuindex.png" class="kefu" @click="tokefu('/pages/user/vip/kefu')"></image>
			<image src="../../static/close-signIn-img.png" class="kefuX" @click="tokefu1"></image>
		</view>
	</view>
</template>
<script>
	/**
	 * @des 微商城首页
	 *
	 * @author stav stavyan@qq.com
	 * @date 2020-01-08 14:14
	 * @copyright 2019
	 */
	import {
		memberInfo
	} from '@/api/userInfo';
	import {
		indexList,
		wholesaleProductIndex,
		memberSign,
		getAdReward,
		vipCard,
		jlship
	} from "@/api/product";
	import {
		merchantIndex
	} from "@/api/merchant";
	import {
		mapMutations
	} from 'vuex';
	import rfSwipeDot from '@/components/rf-swipe-dot/rf-swipe-dot';
	import rfFloorIndex from '@/components/rf-floor-index/rf-floor-index';
	import rfSearchBar from '@/components/rf-search-bar/rf-search-bar';
	import rfSwiperSlide from '@/components/rf-swiper-slide/rf-swiper-slide';
	import {
		notifyAnnounceIndex
	} from "@/api/basic";
	import {
		wechatH5Login,
		islog
	} from "@/api/login"
	import adhttp from"@/utils/ad.js"
	export default {
		components: {
			rfFloorIndex,
			rfSwipeDot,
			rfSearchBar,
			rfSwiperSlide
		},

		watch: {
			vip_cz: {
				deep: true,
				handler: function(newVal, v) {
					console.log(newVal);
					if (this.vip_cz.card_num.trim() != '' && this.vip_cz.card_password.trim() != "") {
						this.que = true;
					} else {
						this.que = false;
					}
					// console.log(newVal[0].name)
				}
			}
		},
		data() {
			return {
				current: 0,
				headerShow: true,
				openScreen: true,
				active: true,
				loadError: false,
				preferential_policies: {
					buy_product: ''
				},
				mdl_info: {},
				carouselList: {},
				hotProductList: [],
				recommendProductList: [],
				guessYouLikeProductList: [],
				newProductList: [],
				productCateList: [],
				brandList: [],
				config: {},
				index: 0,
				videoContext: '',
				jieri: '',
				merchantList: [],
				announceList: [],
				merchant_live: [],
				loading: true,
				hotSearchDefault: '请输入关键字',
				sign_point: '0',
				isVip: false,
				vip_cz: {
					card_num: "",
					card_password: ""
				},
				que: false,
				kefuFlag: true
			};
		},
		onLoad() {
			if (uni.getStorageSync("kefu")) {
				console.log("123", uni.getStorageSync("kefu"))
				this.kefuFlag = false
			}
			//this.initData();
			// const ua = window.navigator.userAgent.toLowerCase();
			// if(ua.match(/micromessenger/i) == 'micromessenger'){
			//     //this.isLogin();

			// }
		},
		onReady() {
			// #ifdef APP-PLUS
			if (uni.getStorageSync('fullscreenShow')) {
				this.videoContext = uni.createVideoContext('myVideo', this);
				this.videoContext.requestFullScreen({
					direction: 0
				});
			}
			// #endif
			// #ifdef APP-PLUS
			// HBuilderX标准基座真机运行测试全屏视频广告位标识（adpid）为：1507000611
			// adpid: 1507000611 仅用于测试，发布时需要改为广告后台（https://uniad.dcloud.net.cn/）申请的 adpid
			// 广告后台申请的广告位(adpid)需要自定义基座/云打包/本地打包后生效
			this.adOption = {
				adpid: '1808569661'
			};
			this.createAd();
			// #endif

		},
		onShow() {
			this.jieri = uni.getStorageSync("jieri");
			console.log(this.jieri)
			if (this.jieri == 1) {
				uni.setTabBarStyle({
					color: '#FFFFFF',
					selectedColor: '#ffd479',
					backgroundColor: '#ed1717',
					borderStyle: 'white',
					backgroundImage: '/static/yuandan/yuanback.png',
					backgroundRepeat: "repeat"
				})
			}
			if (this.jieri == 8) {
				uni.setTabBarStyle({
					color: '#FFFFFF',
					selectedColor: '#ffd479',
					backgroundColor: '#B32728',
					borderStyle: 'white'
				})
			}
			if (uni.getStorageSync('accessToken') && uni.getStorageSync('cartNum')) {
				if (uni.getStorageSync('cartNum') == 0) {
					uni.removeTabBarBadge({
						index: 3
					});
				} else {
					uni.setTabBarBadge({
						index: 3,
						text: uni.getStorageSync('cartNum').toString(),
					});
				}
			}
			this.loading = true;
			this.initData();
		},

		onShareAppMessage() {
			return {
				title: '欢迎来到牡丹商城',
				path: `/pages/index/index`
			}
		},
		//下拉刷新
		onPullDownRefresh() {
			this.getIndexList('refresh');
		},
		methods: {
			// 去牡丹特色馆
			totese() {
				uni.switchTab({
					url: '/pages/category/category'
				})
			},
			// 去客服页面
			tokefu(url) {
				uni.setStorageSync("kefu", 1111)
				this.kefuFlag = false;
				uni.navigateTo({
					url: url
				})
			},
			tokefu1() {
				uni.setStorageSync("kefu", 1111)
				this.kefuFlag = false;
			},
			//会员卡弹窗取消
			centel() {
				this.isVip = false;
			},
			//跳转会员卡页面
			goVip() {
				console.log(1111)
				if (!uni.getStorageSync("userInfo")) {
					uni.navigateTo({
						url: "/pages/public/login"
					})
				} else {
					let isvip = uni.getStorageSync("userInfo").vip;
					if (isvip > 0) {
						uni.navigateTo({
							url: "/pages/user/vip/vip"
						})
					} else {
						this.isVip = true;
					}
				}
			},
			chongzhi() {
				if (this.que) {
					this.$post(vipCard, this.vip_cz).then(res => {
						this.$get(memberInfo).then(r => {
							console.log(r);
							uni.setStorageSync("userInfo", r.data)
						})
						uni.navigateTo({
							url: "/pages/user/vip/vip"
						})
						console.log(res);
					})
				}
			},
			// 跳转节日活动商品
			tohuod() {
				this.active = false
				uni.navigateTo({
					url: "/pages/product/product?id=22"
				})
			},
			createAd() {
				var _ad = this._ad = uni.createFullScreenVideoAd(this.adOption);
				_ad.onLoad(() => {
					this.loading = false;
					this.loadError = false;
					_ad.show();
					console.log('onLoad event')
				});
				_ad.onClose((res) => {
					// adhttp("1808569661")
					// 用户点击了【关闭广告】按钮
					if (res && res.isEnded) {
						// 正常播放结束
						this.token = uni.getStorageSync('accessToken') || undefined;
						if (this.token) {
							this.$post(`${jlship}`, {
								ad_open_id: '1808569661'
							}).then(r => {
								console.log(r)
							}).catch((err) => {
								console.log(err)
							});
						}
					} else {
						// 播放中途退出
						console.log("onClose " + res.isEnded);
					}
					setTimeout(() => {
						uni.showToast({
							title: "全屏视频" + (res.isEnded ? "成功" : "未") + "播放完毕",
							duration: 10000,
							position: 'bottom'
						})
					}, 500)
				});
				_ad.onError((err) => {
					this.loading = false;
					if (err.code) {
						this.loadError = true;
					}
					console.log('onError event', err)
					uni.showToast({
						title: err.errMsg,
						position: 'bottom'
					})
				});
			},
			showAd() {
				
				this.loading = true;
				this._ad.load();
			},
			adLoad(e) {
				if(uni.getStorageSync('accessToken')){
					adhttp("ad_index_banner","1013738552")
				}
				// this.token = uni.getStorageSync('accessToken') || undefined;
				// if (this.token) {
				// 	this.$post(`${getAdReward}`, {
				// 		ad_type: 'ad_index_banner',
				// 		ad_id: e.target.id,
				// 		ad_open_id: '1013738552'
				// 	}).then(r => {
				// 		console.log("点击之后",r)
				// 	}).catch((err) => {
				// 		console.log(err)
				// 	});
				// }
			},
			videoEnd() {
				this.videoContext.exitFullScreen();
				this.openScreen = false;
				uni.setStorageSync('fullscreenShow', false)
			},
			getUrlParam(name) {
				var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)')
				let url = window.location.href.split('#')[0]
				let search = url.split('?')[1]
				if (search) {
					var r = search.substr(0).match(reg)
					if (r !== null) return unescape(r[2])
					return null
				} else {
					return null
				}
			},
			...mapMutations(['login']),
			isLogin() {
				let flag = false;
				console.log(flag)
				var code = this.getUrlParam('code');
				var local = 'http://h5.dongfangqianmen.com/';
				let state = {
					title: '',
					url: 'http://h5.dongfangqianmen.com'
				};
				history.pushState(state, '', '/');
				uni.setStorageSync('weixin_openid', '');

				uni.request({
					url: 'http://backend.dongfangqianmen.com/api/tiny-shop/v1/site/identity-token', //仅为示例，并非真实接口地址。
					data: {
						accessToken: uni.getStorageSync('accessToken') || '',
					},
					success: (res) => {
						if (res.data.code != 200) {
							if (code == null || code == '') {
								window.location.href =
									'https://open.weixin.qq.com/connect/oauth2/authorize?appid=wxb6dd709f6750ce8b&redirect_uri=' +
									encodeURIComponent(local) + '&response_type=code&scope=snsapi_base&state=state#wechat_redirect'
							} else {
								this.$get(wechatH5Login, {
									code: code,
									accessToken: uni.getStorageSync('accessToken') || '',
								}).then(async r => {
									console.log(r);
									if (r.code == 200) {
										if (r.message == 'OK') {
											this.$api.msg('恭喜您，登录成功！');
											this.openid = r.data.openid;
											uni.setStorageSync('weixin_openid', this.openid);
											this.login(r.data);

											this.initWebsocket();
											if (this.userInfo) {
												const oauthClientParams = {}
												/*  #ifdef MP-WEIXIN */
												oauthClientParams.oauth_client = 'wechatMp';
												/*  #endif  */
												/*  #ifndef MP-WEIXIN */
												oauthClientParams.oauth_client = 'wechat';
												/*  #endif  */
												const userInfo = JSON.parse(this.userInfo);
												this.$post(authLogin, {
													...userInfo,
													...oauthClientParams,
													gender: userInfo.sex || userInfo.gender,
													oauth_client_user_id: userInfo.openid || userInfo.openId,
													head_portrait: userInfo.headimgurl || userInfo.avatarUrl,
												});
											}
										} else {
											this.openid = r.data.openid;
											uni.setStorageSync('weixin_openid', this.openid)
											uni.showModal({
												content: '你尚未绑定账号',
												cancelText: '去注册',
												confirmText: '去登录',
												success: (confirmRes) => {
													if (confirmRes.confirm) {
														const url = '/pages/public/login';
														uni.navigateTo({
															url
														})
													} else if (confirmRes.cancel) {
														const url = '/pages/public/register';
														uni.navigateTo({
															url
														})
													}
												}
											});
										}

									} else {
										this.$api.msg('授权失败');
									}
								})
							}
						}
					}
				});

			},
			// 监听切换商户
			bindPickerChange(e) {
				uni.setStorageSync('merchantId', this.merchantList[e.target.value].id);
				uni.setStorageSync('merchantIndex', e.target.value);
				this.index = e.target.value;
				uni.removeStorage({
					key: 'userInfo'
				})
				uni.removeStorage({
					key: 'accessToken'
				})
				this.getIndexList();
			},
			// 监听轮播图切换
			handleDotChange(e) {
				this.current = e.detail.current
			},
			// 数据初始化
			initData() {
				uni.removeStorageSync('cateTop');
				this.getIndexList();
			},
			// 跳转至商品分类列表(分类id)
			navToList(id) {
				uni.navigateTo({
					url: `/pages/product/list?cate_id=${id}`
				})
			},
			// 跳转
			navTo(url) {
				if (url == '/pages/product/vipgoodes?dvip=2') {
					if (!uni.getStorageSync("userInfo")) {
						uni.navigateTo({
							url: "/pages/public/login"
						})
					} else {
						let isvip = uni.getStorageSync("userInfo").vip;
						if (isvip > 0) {
							uni.navigateTo({
								url
							})
						} else {
							this.isVip = true;
						}
					}
					return
				} else {
					uni.navigateTo({
						url
					})
				}

			},
			// 跳至广告图指定页面
			indexTopToDetailPage(data, link) {
				if (data == 'vip_view') {
					if (!uni.getStorageSync("userInfo")) {
						uni.navigateTo({
							url: "/pages/public/login"
						})
					} else {
						let isvip = uni.getStorageSync("userInfo").vip;
						if (isvip > 0) {
							uni.navigateTo({
								url: "/pages/user/vip/vip"
							})
						} else {
							this.isVip = true;
						}
					}
					return
				}

				console.log(data)
				console.log(link)
				let url;
				let type;
				let id;
				if (!link) {
					type = data.type;
					id = data.id;
				} else {
					id = link;
					type = data;
				}
				switch (type) {
					case 'product_view':
						url = `/pages/product/product?id=${id}`;
						break;
					case 'article_view':
						this.$api.msg('article_view');
						break;
					case 'coupon_view':
						url = `/pages/user/coupon/detail?id=${id}`;
						break;
					case 'helper_view':
						this.$api.msg('helper_view');
						break;
					case 'product_list_for_cate':
						url = `/pages/product/list?cate_id=${id}`;
						break;
					case 'vip_view':
						console.log(123)
						break;
					default:
						break;
				}
				if (url) {
					uni.navigateTo({
						url,
					})
				}
			},
			// 跳转至商品分类列表(参数)
			toProductList(params) {
				uni.navigateTo({
					url: `/pages/product/list?params=${JSON.stringify(params)}`
				})
			},
			goZhibo(id) {
				uni.navigateTo({
					url: `/pages/liveBroadcast/liveBroadcast?id=` + id
				})
			},
			// 获取主页数据
			async getIndexList(type) {
				await this.$get(`${indexList}`, {}).then(async r => {
					this.loading = false;
					// // 获取商户列表
					// this.getMerchantIndex();
					// 获取公告列表
					this.getNotifyAnnounceIndex();
					if (type === 'refresh') {
						uni.stopPullDownRefresh();
					}
					this.productCateList = r.data.cate;
					this.carouselList = r.data.adv;
					console.log(this.carouselList)
					this.search = r.data.search;
					uni.setStorageSync('search', this.search);
					this.hotSearchDefault = '请输入关键字' + (r.data.search.hot_search_default ? '如:' + r.data.search.hot_search_default :
						'');
					uni.setStorage({
						key: 'hotSearchDefault',
						data: r.data.search.hot_search_default
					});
					this.hotProductList = r.data.product_hot;
					this.merchant_live = r.data.merchant_live;
					this.recommendProductList = r.data.product_recommend;
					this.guessYouLikeProductList = r.data.guess_you_like;
					this.newProductList = r.data.product_new;
					this.mdl_info = r.data.mdl_info;
					this.preferential_policies = r.data.preferential_policies;
					this.config = r.data.config;
				}).catch(err => {
					this.loading = false;
					console.log(err);
				})

			},
			// 获取商户列表
			async getMerchantIndex() {
				await this.$get(`${merchantIndex}`, {}).then(r => {
					this.merchantList = r.data
					this.index = uni.getStorageSync('merchantIndex') || r.data.length - 1;
				})
			},
			// 获取通知列表
			async getNotifyAnnounceIndex() {
				await this.$get(`${notifyAnnounceIndex}`, {}).then(r => {
					this.announceList = r.data
				})
			},
			// 跳转至商品详情页
			navToDetailPage(id) {
				// const {
				// 	id
				// } = data;
				// if (!id) return;
				uni.navigateTo({
					url: `/pages/product/product?id=${id}`
				})
			},
			// 跳转至搜索详情页
			toSearch() {
				uni.navigateTo({
					url: `/pages/index/search/search?search=${JSON.stringify(this.search)}`
				})
			},
			toDetail(id) {
				uni.navigateTo({
					url: `/pages/product/product?id=${id}`
				})
			},
			// 跳转至分类页
			toCategory() {
				uni.switchTab({
					url: `/pages/category/category`
				})
			}
		}
	}
</script>
<style lang="scss" scoped>
	.indexswiper-box {
		width: 750rpx;
		height: 284rpx;
	}

	.indexswiper-item {
		padding: 0rpx 30rpx 0;
		box-sizing: border-box;

		image {
			width: 690rpx;
			height: 284rpx;
			border-radius: 10rpx !important;
		}
	}

	.namebox {
		height: 150rpx;
		position: relative;

		.name {
			display: -webkit-box;
			/*将对象作为弹性伸缩盒子模型显示*/
			overflow: hidden;
			/* 超出的文本隐藏 */
			text-overflow: ellipsis;
			/* 溢出用省略号显示 */
			word-wrap: break-word;
			/* 文本高出宽度换行 */
			white-space: normal !important;
			/* 溢出不换行 */
			-webkit-line-clamp: 2;
			/* 表示显示的行数 */
			-webkit-box-orient: vertical;
			/* 从上到下垂直排列子元素 */
			font-size: 24rpx;
			font-weight: 500;
			line-height: 33rpx;
			color: #333333;
			padding: 0 10rpx;
		}

		.pricebox {
			position: absolute;
			bottom: 20rpx;
			width: 330rpx;
			left: 0;

			.price {
				margin-left: 20rpx;
				font-size: 32rpx;
				font-weight: 800;
				line-height: 45rpx;
				color: #A61111;
				opacity: 1;
			}

			.price:before {
				content: "￥";
				font-size: 20rpx;
			}

			.xiaolaing {
				position: absolute;
				right: 20rpx;
				font-size: 28rpx;
			}
		}
	}

	.goodbox {
		width: 690rpx;
		margin-left: 30rpx;
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;

		.view {
			width: 330rpx;
			height: 480rpx;
			background-color: #FFFFFF;
			border-radius: 10rpx;
			overflow: hidden;
			margin-bottom: 30rpx;

			image {
				width: 330rpx;
				height: 330rpx;
			}
		}
	}

	.mudan {
		width: 690rpx;
		height: 270rpx;
		margin-left: 30rpx;
		background-image: url(../../static/teseguan.png);
		background-repeat: no-repeat;
		background-size: 690rpx 270rpx;
		margin-top: 40rpx;
		margin-bottom: 40rpx;
		font-size: 83rpx;
		font-weight: bold;
		color: #FFFFFF;
		text-align: center;
		line-height: 270rpx;
	}

	.iconbox {
		width: 690rpx;
		margin-left: 30rpx;
		display: flex;
		justify-content: space-between;
		background-color: #FFFFFF;
		border-radius: 10rpx;
		padding-bottom: 20rpx;

		view {
			width: 150rpx;

			image {
				width: 150rpx;
				height: 150rpx;
			}

			view {
				text-align: center;
				font-size: 32rpx;
				font-weight: 400;
				color: #333333;
				position: relative;
				margin-top: -30rpx;
			}
		}
	}

	.rf-swiper-slide {
		margin-top: 0 !important;
	}

	.kefubox {
		width: 750rpx;
		height: 100vh;
		background-color: rgba(0, 0, 0, 0.5);
		z-index: 999;
		position: fixed;
		top: 0;
		left: 0;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;

		.kefu {
			width: 680rpx;
			height: 688rpx;
		}

		.kefuX {
			width: 68rpx;
			height: 68rpx;
		}
	}

	page {
		background-color: #F2F2F2 !important;
	}

	.index {
		// background-color: $page-color-white;

		/*轮播图*/
		.swiper {
			width: 100%;
			margin-top: 0upx;
			position: relative;
			display: flex;
			justify-content: center;

			.swiper-box {
				width: 100%;
				height: 320upx;
				// overflow: hidden;
				border-radius: 0px;
				box-shadow: 0;
				//兼容ios，微信小程序
				position: relative;
				z-index: 1;

				swiper {
					width: 100%;
					height: 320upx;

					swiper-item {
						image {
							border-radius: 0;
							width: 100%;
							height: 320upx;
						}
					}
				}
			}
		}

		/*轮播图2*/
		.swiper-item-text {
			position: absolute;
			bottom: 16upx;
			left: 30upx;
			height: 48upx;
			line-height: 48upx;
			background: rgba(0, 0, 0, 0.2);
			width: 90%;
			color: $page-color-white;
			border-bottom-left-radius: 12upx;
			padding-left: 20upx;
		}

		/*新闻通知*/
		.swiper-slide-header {
			width: 32upx;
			height: 80upx;
			line-height: 88upx;

			.swiper-slide-image {
				width: 100%;
				height: 34upx;
			}
		}

		/*直播*/
		.zhibo {
			position: relative;
			width: 92%;
			height: 400rpx;
			margin-left: 30rpx;
			border-radius: 6px;
			margin-bottom: 30upx;
			margin-top: 20upx;
			background-color: #FF6688;

			.tou {
				position: absolute;
				left: 25rpx;
				top: 25rpx;
				width: 300rpx;
				height: 50rpx;
				line-height: 50rpx;

				.image {
					width: 35rpx;
					height: 35rpx;
				}

				.text {
					position: absolute;
					width: 200rpx;
					height: 42rpx;
					font-size: 30rpx;
					font-family: PingFangSC-Medium, PingFang SC;
					color: rgba(255, 255, 255, 1);
					// text-align: center;
					margin-left: 20rpx;
					display: inline-block;
					line-height: 42rpx;

				}
			}

			.foot {
				position: relative;
				width: 100%;
				height: 260rpx;
				top: 100rpx;
				// background-color: pink;
				// bottom: 0px;
				display: flex;
				// align-items: center;
				word-break: break-all;
				flex-direction: row;
				overflow: auto;
				word-wrap: break-word;
				padding-left: 18rpx;
				box-sizing: border-box;

				.foot1 {
					position: relative;
					width: 30%;
					height: 246rpx;
					margin-left: 10rpx;
					margin-right: 10rpx;
					border-radius: 4px;

					// border-radius: 2px;
					.tu {
						width: 280rpx;
						height: 245rpx;
					}

					.image {
						position: absolute;
						width: 45rpx;
						height: 45rpx;
						bottom: 10rpx;
						left: 10rpx;
					}

					.text {
						position: absolute;
						width: 120rpx;
						height: 42rpx;
						font-size: 20rpx;
						font-family: PingFangSC-Medium, PingFang SC;
						color: rgba(255, 255, 255, 1);
						margin-left: 20rpx;
						display: inline-block;
						line-height: 42rpx;
						bottom: 10rpx;
						left: 45rpx;
						overflow: hidden;
						text-overflow: ellipsis;
						white-space: nowrap;
					}
				}

				.foot2 {
					position: relative;
					width: 30%;
					height: 246rpx;
					margin-left: 10rpx;
					margin-right: 10rpx;
					border-radius: 4px;

					.tu {
						width: 280rpx;
						height: 245rpx;
					}

					.image {
						position: absolute;
						width: 45rpx;
						height: 45rpx;
						bottom: 10rpx;
						left: 10rpx;
					}

					.text {
						position: absolute;
						width: 120rpx;
						height: 42rpx;
						font-size: 20rpx;
						font-family: PingFangSC-Medium, PingFang SC;
						color: rgba(255, 255, 255, 1);
						// text-align: center;
						margin-left: 20rpx;
						display: inline-block;
						line-height: 42rpx;
						bottom: 10rpx;
						left: 45rpx;
						overflow: hidden;

					}
				}

				.foot3 {
					position: relative;
					width: 30%;
					height: 246rpx;
					margin-left: 10rpx;
					margin-right: 10rpx;
					border-radius: 4px;

					.tu {
						width: 280rpx;
						height: 245rpx;
					}

					.image {
						position: absolute;
						width: 45rpx;
						height: 45rpx;
						bottom: 10rpx;
						left: 10rpx;
					}

					.text {
						position: absolute;
						width: 120rpx;
						height: 42rpx;
						font-size: 20rpx;
						font-family: PingFangSC-Medium, PingFang SC;
						color: rgba(255, 255, 255, 1);
						// text-align: center;
						margin-left: 20rpx;
						display: inline-block;
						line-height: 42rpx;
						bottom: 10rpx;
						left: 45rpx;
						overflow: hidden;
					}
				}

				.foot4 {
					position: relative;
					width: 30%;
					height: 246rpx;
					margin-left: 10rpx;
					margin-right: 10px;
					border-radius: 4px;

					.tu {
						width: 280rpx;
						height: 245rpx;
					}

					.image {
						position: absolute;
						width: 45rpx;
						height: 45rpx;
						bottom: 10rpx;
						left: 10rpx;
					}

					.text {
						position: absolute;
						width: 120rpx;
						height: 42rpx;
						font-size: 20rpx;
						font-family: PingFangSC-Medium, PingFang SC;
						color: rgba(255, 255, 255, 1);
						// text-align: center;
						margin-left: 20rpx;
						display: inline-block;
						line-height: 42rpx;
						bottom: 10rpx;
						left: 45rpx;
						overflow: hidden;
					}
				}
			}
		}

		/*分类列表*/
		.category-list {
			background: #ffffff;
			width: 94%;
			padding: 0 0 30upx 0;
			border-bottom: solid 2upx #ffffff;
			display: flex;
			flex-direction: row;
			flex-wrap: wrap;
			overflow-x: auto;
			margin: -70rpx auto 0;

			view {
				width: 20%;
			}

			.category {

				width: 100%;
				margin-top: 30upx;
				display: flex;
				flex-wrap: wrap;

				.img {
					width: 100%;
					display: flex;
					justify-content: center;

					image {
						width: 13vw;
						height: 13vw;
					}
				}

				.text {
					margin-top: 16upx;
					width: 100%;
					display: flex;
					justify-content: center;
					font-size: 24upx;
					color: #3c3c3c;
				}
			}
		}

		/*版权显示*/
		.copyright {
			margin: 10upx 0;
			width: 100%;
			text-align: center;
			color: #666;

			a {
				display: block;
				color: #666;
				text-decoration: none;
			}
		}

		/*商户切换*/
		.uni-list {
			padding: $spacing-base 0;

			.uni-list-cell {
				.uni-input {
					padding: 0;
				}
			}
		}
	}

	.bg-box {
		position: absolute;
		width: 100%;
		/*background: linear-gradient(90deg,rgba(253,97,48,1) 0%,rgb(255, 1, 1) 50%,rgb(253, 97, 48) 100%);*/
		/*background: linear-gradient(90deg,rgba(255,140,14,1) 0%,rgba(255,88,25,1) 100%);*/
		background-image: url("../../static/index-title-bg.png");
		background-size: 100% 59%;
		height: 45vw;
		top: -5px;
		background-repeat: no-repeat;
		background-color: #f6f6f6;
		//border-radius: 0 0 50% 50%;
	}

	.live-img {
		width: 30rpx;
		height: 28rpx;
		vertical-align: middle;
		margin-left: 20rpx;
		margin-top: -1px;
	}

	.live-box {
		//background: #FF5819;
		border-bottom-left-radius: 6px;
		border-bottom-right-radius: 6px;
		width: 100%;
		padding: 8px;
		text-align: center;
		margin-top: -20rpx;

		.text {
			font-size: 15px;
			font-weight: 700;
			color: #000;
		}

	}

	.live-view {
		background: rgba(255, 255, 255, 1);
		border-radius: 6px;
		width: 46%;
		margin: 20rpx 2% 0rpx 2%;
		display: inline-block;
		vertical-align: middle;
		text-align: left;
	}

	.live {
		width: 100%;
		padding: 0 8%;
		height: 240rpx;
		background-size: 100% 100%;

		.live-tit {
			line-height: 46rpx;
			color: #FF5C69;
			margin-bottom: 5px;
		}
	}

	.img-box {
		width: 47%;
		//background: rgba(255,92,105,0.16);
		border-radius: 6px;
		text-align: center;
		display: inline-block;
		vertical-align: middle;
		height: 130rpx;
		position: relative;

		image {
			width: 90%;
			position: absolute;
			bottom: 7%;
			left: 50%;
			transform: translate(-50%, 0px);
		}
	}

	.spike-box {
		background: linear-gradient(135deg, rgba(255, 116, 86, 1) 0%, rgba(255, 96, 98, 1) 100%);
		border-radius: 6px;
		width: 92%;
		margin: 20rpx auto;
		padding: 20rpx 0;

		.text {
			color: #FFFFFF;
			margin-left: 20rpx;
		}
	}

	.spike-go {
		float: right;
		margin-right: 10px;
		width: 30px;
		text-align: center;
		border-radius: 11px;
		margin-top: 8rpx;
		line-height: 16px;
		height: 16px;
		color: #FF383B;
		margin-top: 3px;
		background: #fff;
	}

	.spike-content {
		text-align: center;
	}

	.spike-img {
		width: 29%;
		background: white;
		border-radius: 6px;
		display: inline-block;
		vertical-align: top;
		padding: 10px 5px 4px;
		margin: 2% 2% 0%;

		image {
			height: 60px;
			width: 65%;
			margin: 0 auto;
		}

		;

		.spike-name {
			font-size: 28rpx;
			font-family: PingFangSC-Medium, PingFang SC;
			font-weight: 700;
			color: rgba(51, 51, 51, 1);
			line-height: 20px;
			text-align: left;
		}

		.spike-price {
			font-size: 12px;
			font-family: PingFangSC-Medium, PingFang SC;
			font-weight: 500;
			color: rgba(255, 49, 52, 1);
			line-height: 20px;
			text-align: left;
		}
	}

	.mdl-box {
		width: 92%;
		margin: 10px auto 0;

		.mdl-title {
			font-size: 36rpx;
			color: rgb(51, 51, 51);
			font-weight: 700;
			margin-bottom: 12upx;
			display: flex;
			justify-content: space-between;
			align-items: center;

			.lookShop {
				font-size: 28rpx;
				font-weight: 400;
				color: #333333;
			}

			.iconfont {
				font-size: 28rpx;
				margin-left: 10rpx;
			}
		}

		.todayPrice {
			display: flex;
			justify-content: center;
			align-items: center;
			position: relative;
			// top: -50upx;
			z-index: 1;
			border: 1px solid #eeeeee;
			background: #fff;
			border-radius: 8upx;

			.todayMarket {
				font-size: 20upx;
				background: linear-gradient(90deg, #FFB866 0%, #FF8789 100%);
				position: absolute;
				top: -1px;
				left: -1px;
				border-radius: 8upx 0 8upx 0;
				color: #fff;
				padding: 0px 12upx;
			}

			.todayPrice-bg {
				width: 100%;
				text-align: center;
				background-color: #ffffff;
				display: flex;
				justify-content: center;
				align-items: center;
				border-radius: 8upx;
			}

			.todayPrice-box {
				width: 50%;
				font-size: 24rpx;
				color: rgb(51, 51, 51);
				margin: 50rpx 0 30rpx;
				text-align: center;
				height: 30rpx;
				line-height: 30rpx;

				.todayPrice-name {
					font-size: 32upx;

					text {
						position: absolute;
						font-size: 26rpx;
						color: #ff0000;
						right: 10rpx;
						top: 8rpx;

					}
				}
			}
		}
	}

	.preferential-box {
		width: 100%;
		text-align: center;
		padding: 30upx 0;
		font-size: 24upx;
		display: flex;
		justify-content: center;
		align-items: center;

		.preferential-img {
			width: 150rpx;
			height: 108rpx;
			// flex: 1;
		}

		.preferential-content {
			flex: 1.8;
			margin-left: 30upx;
			text-align: left;
		}

		.todayPrice-name {
			font-size: 32upx;
			margin-bottom: 10upx;
		}

		.preferential-title {
			font-size: 24upx;
			line-height: 28upx;
			color: #777777;

			text {
				margin-left: 20upx;
				color: #FC9F56;
				display: inline-block;
			}
		}

		.goBuy {
			flex: 0.8;
			background-color: #FCEEE2;
			color: #FC9F56;
			height: 52upx;
			line-height: 52upx;
			border-radius: 52upx;
			font-size: 24upx;
		}
	}

	.openScreen {
		.openScreenVideo {
			position: absolute;
			top: 50%;
			left: 50%;
			width: 0upx;
			height: 0upx;
			transform: translate(-50%, -50%);
			border-radius: 12upx;
			background-color: rgba(0, 0, 0, 0);

			/deep/ .uni-video-container {
				background-color: rgba(0, 0, 0, 0);
			}
		}

		.openScreen-bg2 {
			position: absolute;
			bottom: 0px;
			width: 100%;
		}

		.openScreen-bg3 {
			position: absolute;
			left: 50%;
			transform: translate(-50%, -50%);
			top: 46%;
			width: 100%;
		}
	}

	// .top_ad{width: 100%;top:45vw;position: absolute;}
	.text1 {
		color: rgb(255, 21, 71);
		font-size: 28rpx;
		margin-left: -20rpx;
	}

	.text2 {
		color: rgb(38, 38, 38);
		font-size: 34rpx;
		font-weight: 700;
	}

	.text3 {
		color: rgb(255, 255, 255);
		font-size: 20rpx;
		padding: 0 8rpx;
		line-height: 40rpx;
		border-radius: 30rpx;
		display: inline-block;
		background-color: #007AFF;
	}

	.featuredPavilion {
		position: relative;
		width: 92%;
		margin: 20upx auto 20upx;
		display: flex;
		flex-wrap: wrap;

		.featuredPavilion-box {
			width: 30%;
			font-weight: 500;
			font-size: 30rpx;

			.featuredPavilion-img {
				width: 100%;
				height: 100%;
			}

		}


	}

	.lookVideo {
		position: relative;

		view {
			position: absolute;
			width: 96upx;
			height: 96upx;
			font-size: 46upx;
			font-family: PingFang SC;
			font-weight: bold;
			line-height: 96upx;
			color: #B61C20;
			opacity: 1;
			background: #fff;
			border-radius: 65upx;
			top: 50%;
			right: 45upx;
			transform: translate(0, -50%);
			text-align: center;
		}
	}





	.rf-search-bar {
		background-color: #ffffff;

		.status {
			width: 100%;
			height: 0;
			position: fixed;
			z-index: 10;
			background-color: #ffffff;
			top: 0;
			/*  #ifdef  APP-PLUS  */
			height: var(--status-bar-height); //覆盖样式
			/*  #endif  */
		}

		.header {
			width: 100%;
			height: 100upx;
			display: flex;
			align-items: center;
			position: fixed;
			top: 0;
			z-index: 10;
			background-color: #ffffff;
			/*  #ifdef  APP-PLUS  */
			top: var(--status-bar-height);

			/*  #endif  */
			.addr {
				width: 270upx;
				height: 60upx;
				flex-shrink: 0;
				display: flex;
				align-items: center;
				font-size: 28upx;
				font-weight: 500;

				.iconfont {
					height: 60upx;
					margin-right: 6upx;
					margin-left: 15upx;
					display: flex;
					align-items: center;
					font-size: 35upx;
					color: #CCCCCC;


				}
			}

			.input-box {
				width: 100%;
				height: 60upx;
				background-color: #f5f5f5;
				border-radius: 30upx;
				position: relative;
				display: flex;
				align-items: center;
				justify-content: center;
				margin: 0 20upx 0 10upx;

				/deep/ .iconsousuo {
					color: #7d7d7d;
				}

				.icon {
					z-index: 9;
					display: flex;
					align-items: center;
					position: absolute;
					top: 0;
					right: 0;
					width: 60upx;
					height: 60upx;
					font-size: 34upx;
					color: #c0c0c0;
				}

				input {
					width: 72upx;
					padding-left: 10upx;
					height: 28upx;
					color: #888;
					font-size: 28upx;
				}
			}
		}

		.place {
			background-color: #ffffff;
			height: 100upx;
			/*  #ifdef  APP-PLUS  */
			margin-top: var(--status-bar-height);
			/*  #endif  */
		}
	}

	.header {
		/*background: linear-gradient(90deg,rgba(253,97,48,1) 0%,rgb(255, 1, 1) 50%,rgb(253, 97, 48) 100%);*/
		background-color: #ffffff;
	}

	.rf-search-bar .header .addr .iconfont {
		font-size: 24px;
		color: #999999;
	}

	.active-box {
		height: 100vh;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 1000;
		background: rgba(0, 0, 0, 0.6);
		width: 100%;
	}

	.active-img {
		position: absolute;
		left: 50%;
		width: 600rpx;
		top: 50%;
		transform: translate(-50%, -50%);
	}

	.active-close {
		position: absolute;
		width: 50rpx;
		height: 50rpx;
		left: 80%;
		top: 50%;
		transform: translate(-50%, -380rpx);
	}

	.vip_box {
		margin: 40rpx auto;
		width: 690rpx;
		height: 323rpx;
		border-radius: 12rpx;
	}

	.vip_name {
		display: flex;
		align-items: center;
		background-color: #FFFFFF;
		font-size: 30rpx;
		font-weight: bold;
		color: #333333;
	}

	.rf-swiper-slide {
		background-color: #F2F2F2 !important;
		margin-top: -60rpx;
	}

	.huiyuan {
		width: 100vw;
		height: 100vh;
		position: fixed;
		background-color: rgba(0, 0, 0, 0.5);
		z-index: 10;
		top: 0;
		left: 0;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.huiyuan_b {
		padding-top: 70rpx;
		padding-left: 30rpx;
		padding-right: 30rpx;
		width: 613rpx;
		height: 430rpx;
		border: 1px solid #707070;
		border-radius: 10rpx;
		background-color: #FFFFFF;
	}

	.card_num {
		width: 516rpx;
		display: flex;
		align-items: center;
		font-size: 30rpx;
		font-weight: 400;
		color: #333333;
		border-bottom: 1px solid #B5B5B5;
	}

	.card_pwd {
		margin-top: 50rpx;
	}

	.centel {
		width: 168rpx;
		height: 64rpx;
		display: inline-block;
		background-color: #999999;
		border-radius: 8rpx;
		text-align: center;
		line-height: 64rpx;
		margin-top: 68rpx;
		margin-left: 70rpx;
		color: #FFFFFF;
	}

	.queding {
		background-color: #ff9451;
	}
</style>
